<template>
	<view class="mine">
		<!-- <u-alert :title="title"  type = "info" :closable="closable" :description = "description"></u-alert> -->
		<u-toast ref="uToast"></u-toast>
		<view class="cdk_inp">
			<input type="text" value="" placeholder="请输入您拥有的CDK兑换码" class="inp" v-model="cdknum" />
		</view>
		<view class="quit1" @tap="exchangecdk">确定兑换</view>
		<u-popup :show="show" mode="center" bgColor="transparent">
			<view class="cdkcanbox" v-show="show">
				<view class="can_title">恭喜您获得</view>
				<view class="can_con"><span>1个</span>盲盒</view>
				<view class="can_img">
					<image src="../../static/images/mang.png" mode="aspectFill"></image>
				</view>
				<view class="can_but" @click="chaishop">拆开盲盒</view>
			</view>
		</u-popup>

	</view>
</template>

<script>
	import {
		mixin
	} from '@/Mixins/mixin.js'
	export default {
		mixins: [mixin],
		data() {
			return {
				closable: true,
				title: '提示',
				description: '将在我的藏品中展示',
				cdknum: '',
				show: false,
				loading: false,
				cdkobj: {},
			}
		},
		onReady() {

		},
		onLoad() {

		},
		methods: {
			async chaishop() {
				// this.$http({
				// 		url:this.$api.opencdk,
				// 		method: 'POST',
				// 		hideLoading: true,
				// 		needToken:true,
				// 		data:{id:this.cdkobj.id}
				// }).then((res)=>{
				// 	if(res.code==200){
				// 		// this.show=true;
				// 		this.$refs.uToast.show({
				// 				message: "将在我的藏品里面展示",	
				// 				duration:2000,
				// 		})
				// 	}else{
				// 		console.log(1111);
				// 		uni.$u.toast(res.msg);

				// 		console.log(res.msg);
				// 	}
				// }).catch((err)=>{
				// 	console.log(11112222);
				// 	uni.showToast({
				// 	    message: err.msg,
				// 	    duration:2000,
				// 	})
				// 	console.log(err);

				// })
				this.loading = true
				let data = await this.$http({
					url: this.$api.opencdk,
					method: 'POST',
					hideLoading: true,
					data: {
						id: this.cdkobj.id
					}
				})
				this.loading = false;
				if (data.code == 200) {
					uni.$u.toast('将在我的藏品中看到');
					this.show = false;
					// setTimeout(()=>{
					// 	uni.switchTab({
					// 		url:'pages/Mine/index'
					// 	})
					// })

				} else {
					console.log(data.msg);
					uni.showToast({
						title: data.msg,
						icon: 'none',
						duration: 2000
					})
				}


			},
			exchangecdk() {
				if (this.cdknum == '' || this.cdknum == null || this.cdknum == undefined) {
					this.$refs.uToast.show({
						message: "你的CDK无效/或已被使用",
					})
				} else {
					this.loading = true
					// console.log(this.cdknum);
					this.$http({
						url: this.$api.cdkexchange,
						method: 'POST',
						hideLoading: true,
						needToken: true,
						data: {
							cdk_code: this.cdknum
						}
					}).then((res) => {
						if (res.code == 200) {
							this.show = true;
							this.cdkobj = res.data;
							// uni.$u.toast(res.msg);
							console.log(this.cdkobj);
						} else {
							uni.$u.toast(res.msg);
						}
					})
				}
			},
			//确认cdk兑换
			// async getList(){
			// 	let data = await this.$http({
			// 		url:this.$api.airnum,
			// 		method: 'GET',
			// 		hideLoading: true,
			// 		needToken:true,
			// 	})
			// 	this.loading = true
			// 	console.log('[空投次数]',data)
			// 	if(data.code==200){
			// 		this.airnum=data.data.hitnum;
			// 	}
			// }
			quit() {
				uni.showModal({
					title: '提示',
					content: '是否退出当前账号',
					success: (res) => {
						if (res.confirm) {
							this.$store.commit('ChangeUserInfo', {});
							this.$store.commit('ChangeToken', '');
							// #ifndef H5
							this.toPage('/pages/Index/index')
							// #endif
							// #ifdef H5
							window.location.href = "/"
							// #endif
						} else if (res.cancel) {

						}
					}
				});

			}
		}
	}
</script>

<style lang="scss" scoped>
	.mine {
		min-height: 100vh;
		padding: 30rpx;
		box-sizing: border-box;
		background-color: $nft-bg-color;


		.quit {
			width: 100%;
			height: 90rpx;
			background: #333333;
			border-radius: 44rpx;
			font-size: 28rpx;
			font-weight: 400;
			color: #EFBE62;
			line-height: 90rpx;
			text-align: center;
			margin-top: 66rpx;
		}

		.quit1 {
			width: 100%;
			height: 102rpx;
			background: #F1BE62;
			border-radius: 10rpx;
			font-size: 36rpx;
			font-weight: 400;
			color: #000;
			line-height: 102rpx;
			text-align: center;
			margin-top: 43rpx;
		}

		.cdk_inp {
			width: 100%;
			height: 102rpx;
			border-radius: 4px;
			line-height: 102rpx;

			.inp {
				// width:100%;
				height: 100%;
				border-radius: 4px;
				background: #212526;
				font-size: 30rpx;
				font-family: Microsoft YaHei;
				font-weight: 400;
				color: #DEE2E3;
				;
				padding-left: 36rpx;
			}

		}

		/deep/.u-popup__content[data-v-52d4ddd1] {
			background-color: transparent !important;
		}

		.cdkcanbox {
			width: 535rpx;
			margin: 0 auto;
			// border:1px solid red;
			display: flex;
			flex-direction: column;
			align-items: center;
			margin-top: 110rpx;

			.can_title {
				font-size: 36rpx;
				font-family: Microsoft YaHei;
				font-weight: 400;
				color: #AAAAAA;
				line-height: 36px;
			}

			.can_con {
				font-size: 72rpx;
				font-family: Microsoft YaHei;
				font-weight: 400;
				color: #FFF;
				line-height: 36px;

				span {
					color: #F5C560;
				}
			}

			.can_img {
				image {
					width: 535rpx;
					// background: red;
				}
			}

			.can_but {
				width: 466rpx;
				height: 97rpx;
				border: 2px solid #FFD7BA;
				background: linear-gradient(-84deg, #D0966A 0%, #FBCCA7 100%);
				border-radius: 48rpx;
				line-height: 97rpx;
				text-align: center;

			}
		}


	}
</style>
